<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="css/dropdown-menu.css">
  <script src="framework/js/jquery-3.1.1.js"></script>
  <script src="js/dropdown-menu.js"></script>
  <title>下拉菜单</title>
</head>
<body>
  <div id="navwrap">
    <div id="nav-box">
      <div id="nav-menu">
        <ul id="nav">
          <li><a class="count" href="#">首页</a></li>
          <li><a href="#">餐饮美食</a></li>
          <li><a href="#">休闲娱乐</a></li>
          <li><a href="#">旅游住宿</a></li>
          <li><a href="#">生活服务</a></li>
          <li><a href="#">丽人</a></li>
          <li><a href="#">商品</a></li>
          <li><a id="map" href="#" style="padding: 1px 5px;margin-top: 6px">团购地图</a></li>
        </ul>
      </div>
      <div id="drop">
        <h2>全部团购分类</h2>
        <ul class="hide">
          <li class="food"><img src="img/icon-down.jpg">
            <a class="ti" href="#">美食</a>
            <a href="#">快餐</a>
            <a href="#">火锅</a>
            <div class="pros hide">
              <a href="#">全部(137)</a><a href="#">火锅(17)</a>
              <a href="#">烧烤(16)</a><a href="#">西餐(31)</a>
              <a href="#">海鲜(32)</a><a href="#">特色菜(11)</a>
              <a href="#">日韩料理(11)</a><a href="#">快餐(29)</a>
              <a href="#">蛋糕(20)</a><a href="#">咖啡(15)</a>
              <a href="#">下午茶(8)</a><a href="#">其他(10)</a>
            </div>
          </li>
          <li class="enjoy"><img src="img/icon-down.jpg">
            <a class="ti" href="#">休闲</a>
            <a href="#">电影</a>
            <a href="#">KTV</a>
            <div class="pros hide">
              <a href="#">全部(163)</a><a href="#">电影(18)</a>
              <a href="#">KTV(16)</a><a href="#">运动健身(95)</a>
              <a href="#">游乐电玩(48)</a><a href="#">展览演出(12)</a>
              <a href="#">足疗按摩(37)</a><a href="#">洗浴(34)</a>
              <a href="#">滑雪(6)</a><a href="#">采摘(11)</a>
              <a href="#">温泉(7)</a><a href="#">其他(9)</a>
            </div>
          </li>
          <li class="travel"><img src="img/icon-down.jpg">
            <a class="ti" href="#">旅游</a>
            <a href="#">酒店</a>
            <a href="#">门票</a>
            <div class="pros hide">
              <a href="#">全部(13022)</a><a href="#">酒店(8133)</a>
              <a href="#">旅游(1675)</a><a href="#">景点公园(310)</a>
              <a href="#">其他(1180)</a>
            </div>
          </li>
          <li class="life"><img src="img/icon-down.jpg">
            <a class="ti" href="#">生活</a>
            <a href="#">婚纱</a>
            <a href="#">写真</a>
            <div class="pros hide">
              <a href="#">全部(331)</a><a href="#">写真(14)</a>
              <a href="#">婚纱摄影(225)</a><a href="#">儿童摄影(2)</a>
              <a href="#">汽车养护(3)</a><a href="#">教育培训(31)</a>
              <a href="#">体检(8)</a><a href="#">口腔(1)</a>
              <a href="#">其他(9)</a>
            </div>
          </li>
          <li class="women"><img src="img/icon-down.jpg">
            <a class="ti" href="#">丽人</a>
            <a href="#">美发</a>
            <a href="#">SPA</a>
            <div class="pros hide">
              <a href="#">全部(14)</a><a href="#">美发(7)</a>
              <a href="#">美甲(3)</a><a href="#">美容美体(4)</a>
            </div>
          </li>
          <li class="goods"><img src="img/icon-down.jpg">
            <a class="ti" href="#">商品</a>
            <a href="#">服装</a>
            <a href="#">鞋靴</a>
            <div class="pros hide">
              <a href="#">全部(12156)</a><a href="#">服装(3523)</a>
              <a href="#">生活家居(1163)</a><a href="#">食品饮料(1409)</a>
              <a href="#">化妆品(2034)</a><a href="#">箱包(712)</a>
              <a href="#">家用电器(377)</a><a href="#">手机数码(302)</a>
              <a href="#">鞋靴(1012)</a><a href="#">饮品(602)</a>
              <a href="#">母婴用品(420)</a><a href="#">其他(915)</a>
            </div>
          </li>
          <li class="hot-areas nochild">
            <h2>热门搜索</h2>
            <a href="#">美食</a><a href="#">酒吧</a>
            <a href="#">游泳</a><a href="#">美甲</a>
            <a href="#">蛋糕</a><a href="#">酒店</a>
            <a href="#">电影</a><a href="#">水果</a>
            <a href="#">眼镜</a><a href="#">洗浴</a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</body>
</html>